var lis = document.querySelectorAll("ul.list>li");
lis.forEach(function(item) {
	item.onclick = function() {
		if(!this.classList.contains("show"))
		document.querySelector("ul.list>li.show").classList.remove("show")
		this.classList.add("show")
	}
})
var arr = [
	{id: 24,name: "TCL 98Q10G 98英寸 Mini LED 672黄金分区/XDR 1600nits/4K 120Hz/2.1声道安桥音响/金属全面屏电视",price: 22999,img: "images/sp01.png"},
	{id: 26,name: "TCL 10KG离子柔护洗烘一体机Q10直驱彩屏智能投放免污洗全自动洗衣机 G100Q10-HDI莫奈青",price: 4499,img: "images/sp17.png"},
	{id: 30,name: "TCL 大3匹 小蓝翼 真新风空调 KFRd-72LW/DBp-XCA11+B1",price: 8999,img: "images/sp06.png"}
];
var htmlStr = "";
arr.forEach(function(item) {
	htmlStr += `
		<div class="list-sub-wrapper">
			<div class="list-sub-title">
				<h6>等待买家付款</h6>
				<p>2023-04-08 10:00:34</p> <span></span>
				<p>订单号 : INDENT20230408A00126698</p> <span></span>
				<p style="margin-left: 26%;">订单金额：<span class="price">23799.00</span>元</p>
			</div>
			<div class="list-sub">
			<div class="list-sub-left">
				<div class="list-sub-img">
					<a href=""><img src="${item.img}" alt=""></a>
				</div>
				<div class="list-sub-container">
					<a href=""><p>${item.name}</p></a>
					<span>${item.price}元x1</span>
				</div>
			</div>
			<div class="list-button">
				<button class="btn-buy" type="button">去付款</button>
				<button type="button">订单详情</button>
				<button class="btn-delete" type="button" data-id="${item.id}">删除订单</button>
			</div>
			</div>
		</div>
`;})
document.querySelector(".list-center-container").innerHTML = htmlStr;
var btnDelete = document.querySelectorAll("button.btn-delete");
var dialog = document.querySelector(".dialog");
var form = document.forms["form"]
btnDelete.forEach(function(item) {
	item.onclick = function() {
		var id = parseInt(this.dataset.id);
		dialog.classList.add("show");
		form.name.value = "不想要了";
		form.index.value = id;
	}
})
var btnSave = document.querySelector("button.btn-save");
var btnCancel = document.querySelector("button.btn-cancel");
btnSave.onclick = function() {
	var id = form.index.value;
	var i = arr.find(function(item) {
		return   item.id === id;
	})
	arr.splice(i,1);
	btnDelete.parentNode.parentNode.parentNode.remove();
	form.reset();
	dialog.classList.remove("show");
}
btnCancel.onclick = function() {
	dialog.classList.remove("show");
}
document.querySelector("button.btn-buy").onclick = function() {
	window.location.href = "order/order.html";
}